<template>
    <a-modal
            class="device-detail"
            :title="'评论审核'"
            :width="1200"
            :visible="visible"
            :confirmLoading="confirmLoading"
            @ok="handleOk"
            @cancel="handleCancel"
            cancelText="关闭"
            :maskClosable="false"
            :footer="null">
        <a-spin :spinning="confirmLoading">
            <a-form>
                <div style="margin: 20px 0;">回复“{{ model.remarkContent }}"的评论</div>
                <div style="display: flex;justify-content: flex-end;">
                    <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{
                    selectedRowKeys.length }}</a>项
                    <a style="margin-left: 24px" @click="onClearSelected">清空</a>
                </div>
                <a-table
                        ref="table"
                        size="middle"
                        rowKey="id"
                        :columns="columns"
                        :dataSource="dataSource"
                        :pagination="ipagination"
                        :loading="loading"
                        @change="handleTableChange">
          <span slot="action" slot-scope="text, record">
            <a @click="checkPass(record,1)" v-if="record.checkResult == 0 || record.checkResult == 2" title="通过"><a-icon
                    type="check-circle" style="color:#35ab5f"/></a>
            <a @click="checkPass(record,2)" v-if="record.checkResult == 1" title="不通过"><a-icon type="close-circle"
                                                                                               style="color:#ed7770"/></a>
          </span>
                </a-table>
            </a-form>
        </a-spin>
    </a-modal>
</template>

<script>
    import {putAction} from '@/api/manage';
    import {JeecgListMixin} from '@/mixins/JeecgListMixin'

    export default {
        mixins: [JeecgListMixin],
        data() {
            return {
                visible: false,
                model: {},
                confirmLoading: false,
                url: {
                    list: '/video/shortVideoRemarkReply/list',
                    edit: '/video/shortVideoRemarkReply/edit'
                },
                columns: [{
                    title: '#',
                    dataIndex: '',
                    key: 'rowIndex',
                    align: 'center',
                    customRender: function (t, r, index) {
                        return parseInt(index) + 1
                    }
                },
                    {
                        title: '评论用户姓名',
                        align: 'center',
                        dataIndex: 'userName'
                    },
                    {
                        title: '评论内容',
                        align: 'center',
                        dataIndex: 'content'
                    },
                    {
                        title: '审核结果',
                        align: 'center',
                        dataIndex: 'checkResult',
                        customRender: function (t, r, index) {
                            return t == 0 ? '待审核' : t == 1 ? '通过' : '不通过'
                        }
                    },
                    {
                        title: '操作',
                        dataIndex: 'action',
                        align: 'center',
                        scopedSlots: {
                            customRender: 'action'
                        }
                    }
                ]
            }
        },
        methods: {
            add() {
                this.edit({})
            },
            edit(record) {
                this.queryParam.remarkId = record.id;
                this.model = Object.assign({}, record);
                this.visible = true;
                this.loadData();
            },
            close() {
                this.$emit('close')
                this.visible = false
            },
            handleCancel() {
                this.close()
            },
            tabChange(key) {
                this.activeKey = key
            },
            checkPass(record, value) {
                const param = {
                    id: record.id,
                    checkResult: value
                }
                putAction(this.url.edit, param).then(res => {
                    if (res.success) {
                        this.visible = false
                        this.loadData(1)
                    }
                })
            },
        }
    }
</script>

<style lang="less">
    .device-detail {
        .ant-modal-body {
            height: 600px;
            padding-top: 0;
        }
    }

    .red {
        color: #f50;
    }

    .blue {
        color: #108ee9;
    }
</style>
